<template>
	<view class="success-components" v-if="showSuccess">
		<u-icon size="146" name="checkmark-circle-fill" :color="themeColor"></u-icon>
		<text class="state-text">{{ state }}</text>
		<text class="tips-text" v-if="tips">{{ tips }}</text>
		<view class="back-button"><slot></slot></view>
	</view>
</template>

<script>
export default {
	name: 'success',
	props: {
		tips: {
			type: String
		},
		state: {
			type: String,
			default: '成功'
		},
		router: {
			type: String
		},
		title: {
			type: String
		}
	},
	data() {
		return {
			showSuccess: false
		};
	},
	methods: {
		show() {
			if(this.title){
				uni.setNavigationBarTitle({
					title: this.title
				});
			}
			this.showSuccess = true;
		}
	}
};
</script>

<style scoped lang="scss">
.success-components {
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 1000;
	display: flex;
	padding: 144rpx;
	position: fixed;
	align-items: center;
	flex-direction: column;
	background-color: #f5f5f5;
	.state-text {
		margin: 40rpx 0;
		font-size: 36rpx;
		font-weight: bold;
	}
	.tips-text {
		color: #999999;
		font-size: 28rpx;
		text-align: center;
	}
	.back-button {
		width: 100%;
		margin-top: 200rpx;
	}
}
</style>
